// ========================定制项目图片上传处理===切边上传============================
var imgReaderl = new FileReader();
var regexImageFiler = /^(?:image\/bmp|image\/png|image\/jpeg|image\/jpg|\/gif)$/i;
// 调起系统文件选择框方法
var imgChange = $(".imgChange").prev().prev();
var imgfFilemaxSize, ThisImgInput, ThisImgInputName, ThisImg, imgUrl;
var thisImgclick;

$("body").on("click", ".imgChange", function (e) {
  //标准项目
  //触发 文件选择的click事件
  thisImgclick = $(this);
  $("#file").trigger("click"); //模拟单击文件选择器
  thisIMg = $(this).prev().prev();
  ThisImgInput = $(this).prev();
  // thisIMg.attr("src", "ewrwrre");
  // console.log('img1', $(this))
});

$("#device").on(" click", ".imgChange3", function (e) {
  //定制项目中用的
  thisImgclick = $(this);
  $("#file").trigger("click"); //模拟单击文件选择器
  thisIMg = $(this).prev().prev();
  ThisImgInput = $(this).prev();
});
var thisImgChangeNmae = "0";
$("#device").on(" click", ".imgChange4", function (e) {
  //新项目添加附件
//   console.log(e);
  thisImgclick = $(this);
  $("#file").trigger("click"); //模拟单击文件选择器
  thisIMg = $(this).prev().prev();
  ThisImgInput = $(this).prev();
  thisImgChangeNmae = "imgChange4";
});

var imgfFile;

function fileOnchange(e) {
  //   var imgBase64Url = $("#file").attr("value");
  imgUrl = $("#file").val();
  imgfFile = $("#file").prop("files")[0]; //获取选择文件
  // console.log('imgfFile', imgfFile)
  var size = imgfFile.size; //注意，这里读到的是字节数
  imgfFilemaxSize = size / 1024; //转化为字节
  // console.log('img2', $(this))
}

// 压缩图片方法
async function lrzfun(imgUrl, imgfFile, thisIMg, ThisImgInput, IMgwidth, msg) {
  try {
    lrz(imgfFile, {
      width: IMgwidth,
    })
      .then(function (rst) {
        if (rst != "" && rst != null && rst != undefined && rst != "undefined") {
          var rstBlob = rst.file; //blobToFile
          var rstBlobName = rst.origin.name || null;
          var index = rstBlobName.lastIndexOf("/");
          var imgName = timestamp() + rstBlobName.substring(index + 1, rstBlobName.length);
          // console.log(imgName)
          var file2 = new File([rstBlob], imgName, {
            type: "image/jpg",
            lastModified: Date.now(),
          });
          var size = file2.size; //注意，这里读到的是字节数
          var imgFilemaxSize = parseFloat(size / 1024).toFixed(4); //转化为字节
          // console.log("压缩后尺寸：", imgFilemaxSize);
          upload(imgUrl, file2, thisIMg, ThisImgInput);
        }
        return rst;
      })
      .then(function (rst) {
        return rst;
      })
      .catch(function (err) {
        // alert(err);
        console.log(err);
      })
      .always(function () {
        // console.log("img5-压缩");
      });
  } catch (error) {
    console.log("async", error);
  }
  return true;
}

/* ==================================================== */
// 文件选择款改变事件和压缩图片方法 addEventListener
var yasuoNB = 0,
  imgName,
  imgName2;
// document.querySelector("#file").addEventListener("change", function (e) {
$("#file").change(function (e) {
  try {
    // console.log('img3', $(this));
    imgUrl = $("#file").val() || "input.txt"; //获取文件名
    imgfFile = $("#file").prop("files")[0] || null; //获取选择文件
    var size = imgfFile.size; //注意，这里读到的是字节数
    imgfFilemaxSize = parseFloat(size / 1024).toFixed(4); //转化为字节
    // console.log(imgfFilemaxSize);
    if (!regexImageFiler.test(imgfFile.type)) {
      layer.confirm("请选择有效图片");
    } else if (thisImgChangeNmae == "imgChange4") {
      oss(imgUrl, imgfFile);
    } else {
      if (imgfFilemaxSize > 10240) {
        layer.confirm("请提交容量10240KB(10MB)字节以下大小的图片文件！" + imgfFilemaxSize);
        // console.log("图片大于10240kb");
        yasuoNB = 10;
      } else if (imgfFilemaxSize > 7000 && imgfFilemaxSize < 10240) {
        imgfFilemaxSize > 7000 && lrzfun(imgUrl, imgfFile, thisIMg, ThisImgInput, 1180, "图片大于7000小于10240");
        yasuoNB = 9;
      } else if (imgfFilemaxSize > 6000 && imgfFilemaxSize < 7000) {
        lrzfun(imgUrl, imgfFile, thisIMg, ThisImgInput, 1080, "图片大于6000小于7000");
        yasuoNB = 8;
      } else if (imgfFilemaxSize > 5000 && imgfFilemaxSize < 6000) {
        lrzfun(imgUrl, imgfFile, thisIMg, ThisImgInput, 960, "图片大于5000小于6000");
        yasuoNB = 7;
      } else if (imgfFilemaxSize > 4000 && imgfFilemaxSize < 5000) {
        lrzfun(imgUrl, imgfFile, thisIMg, ThisImgInput, 860, "图片大于4000小于5000");
        yasuoNB = 6;
      } else if (imgfFilemaxSize > 3000 && imgfFilemaxSize < 4000) {
        lrzfun(imgUrl, imgfFile, thisIMg, ThisImgInput, 760, "图片大于3000小于4000");
        yasuoNB = 5;
      } else if (imgfFilemaxSize > 2000 && imgfFilemaxSize < 3000) {
        lrzfun(imgUrl, imgfFile, thisIMg, ThisImgInput, 660, "图片大于2000小于3000");
        yasuoNB = 4;
      } else if (imgfFilemaxSize > 1000 && imgfFilemaxSize < 2000) {
        lrzfun(imgUrl, imgfFile, thisIMg, ThisImgInput, 560, "图片大于1000小于2000");
        yasuoNB = 3;
      } else if (imgfFilemaxSize > 100 && imgfFilemaxSize < 1000) {
        lrzfun(imgUrl, imgfFile, thisIMg, ThisImgInput, 460, "图片大于100小于1000");
        yasuoNB = 2;
      } else if (imgfFilemaxSize < 100) {
        upload(imgUrl, imgfFile, thisIMg, ThisImgInput);
        yasuoNB = 1;
        // console.log('图片小于100')
      } else if (imgfFilemaxSize < 10) {
        yasuoNB = 0;
        layer.confirm("图片太小了，请替换其他图片！");
      }
      imgName = imgfFile.name;
    }
    // }
  } catch (error) {
    console.log(error);
  } finally {
    // e.srcElement.value = "";
    // console.log('清空inputImgfile')
  }
});
/* ==================================================== */

// 阿里云OSS提交图片方法初始化
var client = new OSS.Wrapper({
  region: "oss-cn-shenzhen", //阿里云获取
  //   accessKeyId: "LTAI5tHqQx4GmMu4osB4D4Dm",//自己的子账户
  //   accessKeySecret: "lOj5dQBmLDeGFqMBT4g229eDHf0sx21",
  accessKeyId: "LTAI5t6zdkiGK83mkd36Xpe7", //自己的主账户
  accessKeySecret: "0JsypxPQBWY9LrTgHpuds7JMFU1Vmz",
  bucket: "zhilai-baojia", //要存储的目录名
  // accessKeySecret: "gu4eUbPrABK4b48vfETESGQJnhI4TM",
  // bucket: "flm158", //要存储的目录名
  headers: {
    "w-auth-token": "0JsypxPQBWY9LrTgHpuds7JMFU1Vmz",
    "x-oss-forbid-overwrite": "true",
    "x-oss-tagging": "Tag1=1&Tag2=2",
  },
});

const headers = {
  // 指定该Object被下载时的网页缓存行为。
  "Cache-Control": "no-cache",
  // 指定该Object被下载时的名称。
  "Content-Disposition": "example.txt",
  // 指定该Object被下载时的内容编码格式。
  "Content-Encoding": "utf-8",
  // 指定过期时间，单位为毫秒。
  Expires: "1000",
  // 指定Object的存储类型。
  "x-oss-storage-class": "Standard",
  // 指定Object标签，可同时设置多个标签。
  "x-oss-tagging": "Tag1=1&Tag2=2",
  // 指定初始化分片上传时是否覆盖同名Object。此处设置为true，表示禁止覆盖同名Object。
  "x-oss-forbid-overwrite": "true",
};

// 指定上传到examplebucket的Object名称，例如exampleobject.txt。
const name = "exampleobject.txt";
// 获取DOM。
const submit = document.getElementById("submit");
const options = {
  // 获取分片上传进度、断点和返回值。
  progress: (p, cpt, res) => {
    // console.log(p);
  },
  // 设置并发上传的分片数量。
  parallel: 4,
  // 设置分片大小。默认值为1 MB，最小值为100 KB。
  partSize: 1024 * 1024,
  // headers,
  // 自定义元数据，通过HeadObject接口可以获取Object的元数据。
  meta: {
    year: 2020,
    people: "test",
  },
  mime: "text/plain",
};

//阿里云oss上传方法及文件名处理1  vai是文件名
function upload(fileName, file, nodeImg, ThisImgInput) {
  //文件后缀类型、文件流、节点、旁边input元素
  try {
    // console.log(file);
    var suffix = fileName.substr(fileName.indexOf("."));
    var obj = timestamp();
    var storeAs = "img/" + obj + suffix;
    client
      .multipartUpload(storeAs, file)
      .then(function (result) {
        var url = result.res.requestUrls[0];
        var length = url.lastIndexOf("?");
        if (result.res.status == 200 || length == "-1") {
          //   console.log("upload:", result.url);
          nodeImg.attr("src", result.url);
          // console.log(nodeImg);
          nodeImg[0].style.backgroundImage = "url('')"; //清除无图提示背景写出地址到img
          ThisImgInput.attr("value", result.url); //写出地址到input
          ThisImgInput.val(result.url);
          ThisImgInput.html(result.url);
          ThisImgInput.text(result.url);
        } else {
          // console.log(result.res);
          Toast("上传失败！", "error", 2000);
        }
      })
      .catch(function (err) {
        console.log(err);
        Toast("上传错误！", "error", 2000);
      });
  } catch (error) {
    console.log(error);
  }
}

var uplodResultData;

function timestamp() {
  var time = new Date();
  var y = time.getFullYear();
  var m = time.getMonth() + 1;
  var d = time.getDate();
  var h = time.getHours();
  var mm = time.getMinutes();
  var s = time.getSeconds();
  return "" + y + add0(m) + add0(d) + add0(h) + add0(mm) + add0(s);
}

function add0(m) {
  return m < 10 ? "0" + m : m;
}

//压缩图片方法  实际压缩不了
function compressImg(imgUrl, imgfFile, thisIMg) {
  var src;
  var fileSize = parseFloat(parseInt(imgfFile["size"]) / 1024).toFixed(2);
  var read = new FileReader();
  read.readAsDataURL(imgfFile);
  read.onload = function (e) {
    var img = new Image();
    img.src = e.target.result;
    img.onload = function () {
      //默认按比例压缩
      var w = this.width,
        h = this.height;
      //生成canvas
      var canvas = document.createElement("canvas");
      var ctx = canvas.getContext("2d");
      var base64;
      // 创建属性节点
      canvas.setAttribute("width", w);
      canvas.setAttribute("height", h);
      ctx.drawImage(this, 0, 0, w, h);
      // if (fileSize < 100) {
      //如果图片小于一兆 那么不执行压缩操作
      base64 = canvas.toDataURL(file["type"], 0.1);
      var blob = dataURLtoFile(base64, "image/jpeg");
      // console.log('base64', base64, blob)

      return base64;
    };
  };
}

// BASE64与文件互转
function dataURLtoBlob(dataurl) {
  let arr = dataurl.split(","),
    mime = arr[0].match(/:(.*?); /)[1],
    bstr = atob(arr[1]),
    n = bstr.length,
    u8arr = new Uint8Array(n);
  while (n--) {
    u8arr[n] = bstr.charCodeAt(n);
  }
  return new Blob([u8arr], {
    type: mime,
  });
}

// 将blob转换为file
function blobToFile(theBlob, fileName) {
  theBlob.lastModifiedDate = new Date();
  theBlob.name = fileName;
  return theBlob;
}

var canvas = document.createElement("canvas"),
  ctx = canvas.getContext("2d");

function compress(img) {
  canvas.width = img.width;
  canvas.height = img.height;
  //利用canvas进行绘图
  //将原来图片的质量压缩到原先的0.2倍。
  var data = canvas.toDataURL("image/jpeg", 0.2); //data url的形式
  return data;
}

//将base64转换为blob
function dataURLtoFile(dataURI, type) {
  let binary = atob(dataURI.split(",")[1]);
  let array = [];
  for (let i = 0; i < binary.length; i++) {
    array.push(binary.charCodeAt(i));
  }
  return new Blob([new Uint8Array(array)], {
    type: type,
  });
}

// getImgBase64();
// 图片处理
function getImgBase64() {
  //图片转BASE64
  var base64 = "";
  var img = new Image();
  img.src = "images/open.jpg";
  img.onload = function () {
    base64 = image2Base64(img);
    // console.log(base64);
  };
}

// image2Base64(img);
//图片转
function image2Base64(img) {
  //base64转图片
  var canvas = document.createElement("canvas");
  canvas.width = img.width;
  canvas.height = img.height;
  var ctx = canvas.getContext("2d");
  ctx.drawImage(img, 0, 0, img.width, img.height);
  var dataURL = canvas.toDataURL("images/png");
  // alert(dataURL);
  return dataURL;
}

// // =====================tobig========================
// // window.onload = (function () {
// // 单击放大后再单击任何地方或从照片上挪开恢复大小
// // $(".boxImg").mouseout(function (e) {
// //   // alert(e);
// //   // $(this).removeClass("big");
// //   // console.log(this);
// // });
//
var TImg;
$(".tobig").click(function () {
  thisIMg = $(this).prev().prev().prev();
  thisIMg.addClass("big");
  $("img").attr("title", "单击图片可以关闭窗口!");
});

$("img").click(function () {
  var imgs = $("img[class='big']");
  var that = $(this);
  imgs.removeClass("big");
  that.removeClass("big");
  $("img").removeAttr("title");
});

// $("img").mouseout(function () {
//   // thisIMg = $(this).prev().prev().prev();
//   //   console.log(thisIMg);
//   // thisIMg.removeClass("big");
//   // TImg.removeClass("big");
// });
// // })();
